<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>个人资料--layui后台管理模板 2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../component/layui/css/layui.css" media="all"/>

</head>
<body class="childrenBody">
<form class="layui-form layui-row" lay-filter="test">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md3">
            <div class="layui-card">
                <div class="layui-card-body" style="padding: 25px;text-align: center;">
                    <div class="text-center layui-text">
                        <div class="user-info-head" id="userInfoHead">
                            <img src="" id="userAvatar" width="115px" height="115px" alt="">
                        </div>
                        <h2 style="padding-top: 20px;font-size: 20px;">就眠仪式</h2>
                    </div>
                </div>
                <div style="height: 45px;border-top: 1px whitesmoke solid;text-align: center;line-height: 45px;font-size: 13.5px;">
                    <span>陕西省，西安市</span>
                </div>
            </div>
        </div>
        <div class="layui-col-md6 layui-col-xs12">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                    <input type="text" id="username" name="username" disabled class="layui-input layui-disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户角色</label>
                <div class="layui-input-block">
                    <input type="text" name="author" id="author" disabled class="layui-input layui-disabled">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">真实姓名</label>
                <div class="layui-input-block">
                    <input type="text" value="" id="name" name="name" placeholder="请输入真实姓名" lay-verify="required"
                           class="layui-input realName">
                </div>
            </div>


                    <input type="text" value="" id="id" name="id"  lay-verify="required"
                           class="layui-input realName" style="display: none">


            <div class="layui-form-item" pane="">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block" id="update_sex">
                    <input type="radio" name="sex" id="sex1" value="男" title="男">
                    <input type="radio" name="sex" id="sex2" value="女" title="女" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-block">
                    <input type="tel" value="" name="phone" id="phone" placeholder="请输入手机号码" lay-verify="phone"
                           class="layui-input userPhone">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">注册日期</label>
                <div class="layui-input-block">
                    <input type="text" id="created" name="created" value="" placeholder="请输入出生年月"
                           lay-verify="userBirthday" readonly
                           class="layui-input userBirthday">
                </div>
            </div>
            <div class="layui-form-item" id="area-picker">
                <div class="layui-form-label">网点地址</div>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="province" class="province-selector" data-value="广东省" lay-filter="province-1">
                        <option value="">请选择省</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="city" class="city-selector" data-value="深圳市" lay-filter="city-1">
                        <option value="">请选择市</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="county" class="county-selector" data-value="龙岗区" lay-filter="county-1">
                        <option value="">请选择区</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">邮箱</label>
                <div class="layui-input-block">
                    <input type="text" value="" name="email" id="email" placeholder="请输入邮箱" lay-verify="email"
                           class="layui-input userEmail">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">自我评价</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" id="beizhu" name="beizhu" class="layui-textarea myself"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="changeUser">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </div>
    </div>
</form>
<script type="text/javascript" src="../../component/layui/layui.js"></script>
<script type="text/javascript" src="../../component/pear/pear.js"></script>
<script type="text/html" id="created1">
    {{layui.util.toDateString(data.created, 'yyyy-MM-dd')}}
</script>
<script>
    layui.config({
        base: '../../component/layui/mods/'
        , version: '1.0'
    });

    layui.use(['jquery','element','layer','upload','form','layarea'],function () {
        var element = layui.element,
            layer = layui.layer,
            admin = layui.admin,
            upload = layui.upload,
            laydate=layui.laydate,
            form = layui.form,
            layarea = layui.layarea,
            $ = layui.jquery;

        var form = layui.form;
        let MODULE_PATH = "operate/";
        $("#userAvatar").attr("src", parent.layui.$(".layui-nav-img").attr("src"));
        var user = JSON.parse(localStorage.getItem("user"));
        user.data.created = layui.util.toDateString(user.data.created, 'yyyy-MM-dd')
        form.val("test", user.data)

        laydate.render({
            elem: '#created' //指定元素
        });
        window.callback = function (data) {

            layer.close(data.index);
            $("#userAvatar").attr("src", data.newAvatar);

            parent.layui.$(".layui-nav-img").attr("src", data.newAvatar);
        }



        layarea.render({
            elem: '#area-picker',
            // data: {
            //     province: '广东省',
            //     city: '深圳市',
            //     county: '龙岗区',
            // },
            change: function (res) {
                //选择结果
                console.log(res);
            }
        });



        form.on('submit(changeUser)', function (data) {
            var created=data.field.created;
            created = new Date(created);
            data.field.created=created;
            $.ajax({
                url:"http://localhost/updateme",
                data:data.field,
                type:"POST",
                success:function (d) {
                    console.log(d)
                    // window.parent.location.reload();
                   localStorage.setItem("user",JSON.stringify(data.field));
                }
            })
        });


        $("#userAvatar").click(function () {
            layer.open({
                type: 2,
                title: '更换图片',
                shade: 0.1,
                area: ["900px", "500px"],
                content: MODULE_PATH + 'uploadProfile.html',
                btn: ['确定', '取消'],
                yes: function (index, layero) {
                    window['layui-layer-iframe' + index].submitForm();
                }
            });
        });
    });
</script>
</body>
</html>
